<template>
	<div class="person">
		<ul>
			<li v-for="item in list" :key="item.id">
				{{item.name}}-{{item.age}}
			</li>
		</ul>
	</div>
</template>
<script lang="ts" setup>
import {defineProps, withDefaults} from 'vue'
import {type Persons} from '@/types'

//接收list
//defineProps(['list'])
//接收list + 限制类型
//defineProps<{list:Persons}>()

//接收list + 限制类型 + 限制必要性 + 指定默认值
withDefaults(defineProps<{list?:Persons}>(),{
	list:()=>[{id:'1',name:'展昭',age:7}]
})

//接收list,同时将props保存起来
// let x = defineProps(['list'])
// console.log(x)

</script>
<style>
.person {
	padding: 10px;
}
</style>
